{if condition="$instance['instancestatus'] neq 0"}
<style>
    .flowcontent input {
        pointer-events: none;
        border: 1px solid #DDD;
        background-color: #F5F5F5;
    }

    .flowcontent select {
        pointer-events: none;
        border: 1px solid #DDD;
        background-color: #F5F5F5;
    }

    .flowcontent textarea {
        pointer-events: none;
        border: 1px solid #DDD;
        background-color: #F5F5F5;
    }

</style>
{/if}
<div class="layui-form" lay-filter="layuiadmin-form-admin" id="layuiadmin-form-admin" style="padding: 20px 30px 0 0;">
    <input type="hidden" id="taskid" name="taskid" value="{$task->id ?? ''}" required autocomplete="off"
           class="layui-input" disabled>
    <input type="hidden" id="ids" name="ids" value="{$ids ?? ''}" required autocomplete="off"
           class="layui-input" disabled>
    <input type="hidden" id="flowcode" name="flowcode" value="{$flowCode ?? ''}" required autocomplete="off"
           class="layui-input" disabled>
    <input type="hidden" id="table" name="table" value="{$table ?? ''}" required autocomplete="off"
           class="layui-input" disabled>
    <input type="hidden" id="status" name="status" value="{$model.status ?? ''}" required autocomplete="off"
           class="layui-input" disabled>
    <div class="layui-row">
        <div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
            <div class="layui-form-item ">
                <label class="layui-form-label">申请人</label>
                <div class="layui-input-block">
                    <input type="text" value="  {$originator.nickname ?? ''}" required placeholder="申请人"
                           autocomplete="off"
                           class="layui-input" disabled>
                </div>
            </div>
        </div>
        <div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
            <div class="layui-form-item ">
                <label class="layui-form-label">所属部门</label>
                <div class="layui-input-block">
                    <input type="text" value="{$model.dept.name ?? ''}" required placeholder="所属部门"
                           autocomplete="off"
                           class="layui-input" disabled>
                </div>
            </div>
        </div>
        <div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
            <div class="layui-form-item ">
                <label class="layui-form-label">填写日期</label>
                <div class="layui-input-block">
                    <input type="text" value="  {$model.create_time ?? ''}" required placeholder="填写日期"
                           autocomplete="off"
                           class="layui-input" disabled>
                </div>
            </div>
        </div>
        <div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
            <div class="layui-form-item ">
                <label class="layui-form-label">项目名称</label>
                <div class="layui-input-block">
                    <input type="text" id="name" value="{$model.name ?? ''}" required placeholder="日期范围"
                           autocomplete="off"
                           class="layui-input" isxsj='1'>
                </div>
            </div>
        </div>
        <div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
            <div class="layui-form-item ">
                <label class="layui-form-label">项目周期</label>
                <div class="layui-input-block">
                    <input type="text" id="period" value="{$model.period ?? ''}" required placeholder="项目周期"
                           autocomplete="off"
                           class="layui-input" isxsj='1'>
                </div>
            </div>
        </div>
        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
            <div class="layui-form-item ">
                <label class="layui-form-label">项目描述</label>
                <div class="layui-input-block">
                    <textarea class="layui-textarea" id="content" data-use-current="true" isxsj='1' name="comment">{$model.content ?? ''}</textarea>
                </div>
            </div>
        </div>
        {if condition="$instance['instancestatus'] neq 2"}
        <div class="layui-form-item">
            <label class="layui-form-label">审批意见</label>
            <div class="layui-input-block">
                <textarea id="comment" class="layui-textarea" data-use-current="true" name="comment"></textarea>
            </div>
        </div>
        {/if}
        <div class="layui-form-item">
            <label class="layui-form-label">审批历史</label>
            <div class="layui-input-block">
                <table class="layui-table">
                    <thead>
                    <tr>
                        <td>审批人</td>
                        <td>审批步骤</td>
                        <td>审批意见</td>
                        <td>审批时间</td>
                    </tr>
                    </thead>
                    <tbody>
                    {volist name="history" id="vo" }
                    <tr>
                        <td>{$vo.nickname}</td>
                        <td>{$vo.stepname}</td>
                        <td>{$vo.comment}</td>
                        <td>{$vo.completedtime}</td>
                    </tr>
                    {/volist}
                    </tbody>
                </table>
            </div>
        </div>
        <div class="form-group layer-footer">
            <label class="control-label col-xs-12 col-sm-2"></label>
            <div class="layui-input-block">
                {if condition="$mode neq 'view'"}
                {if condition="$instance['instancestatus'] eq 0"}
                <button type="button" id='start' class="layui-btn">提交</button>
                {elseif condition="$instance['instancestatus'] eq 1"/}
                <button type="submit" id='agree' class="layui-btn btn-success btn-embossed disabled"
                        style="background-color: #18bc9c !important; border-radius: 5px;">同意
                </button>
                <button type="submit" id='refuse' class="layui-btn btn-danger btn-embossed disabled"
                        style="background-color: #e74c3c !important; border-radius: 5px;">拒绝
                </button>
                {else/}
                {/if}
                {/if}
                <!--            {if condition="$instance['instancestatus'] neq 2 and $instance['instancestatus'] neq 3 and $instance['originator'] eq $auth->id"}-->
                <!--                 <button type="submit" id='cancel' class="layui-btn btn-danger btn-embossed disabled"style="background-color: #e74c3c !important; border-radius: 5px;">取消</button>-->
                <!--            {/if}-->
                <button type="button" id='flowchart' class="layui-btn layui-btn-warm btn-embossed"
                        style="background-color: #f39c12 !important; border-radius: 5px;">流程图
                </button>
            </div>
        </div>
    </div>
</div>
<script src="/static/admin/layui/layui.js"></script>
<script>
    var url = "{:url('Myworkitem/flowchart')}", edit = "{:url('Myworkitem/edit')}",
        refuse = "{:url('Myworkitem/refuse')}", check = "{:url('Myworkitem/check')}";
    layui.config({
        base: '/static/admin/' //静态资源所在路径
    }).extend({
        index: 'lib/index', //主入口模块
    }).use(['index', 'form','laydate','flow'], function () {
        var $ = layui.$, form = layui.form, laydate = layui.laydate;
        var taskid = $('#taskid').val();
        var ids = $('#ids').val();
        var flowcode = $('#flowcode').val();
        var table = $('#table').val();
        var param = $.param({'taskid': taskid, 'ids': ids, 'flowcode': flowcode});
        var status = $('#status').val();
        if (status != -1 || status != "-1") {
            $("[isxsj='1']").attr("disabled", true)
        }
        //日期范围
        laydate.render({
            elem: '#period'
            , range: '~'
            , format: "yyyy-MM-dd"
            , trigger: 'click'//呼出事件改成click
        });
        $('#agree').on('click', function (res) {
            var comment = $('#comment').val();
            // var select = $('#level_id').val();
            $.ajax({
                url: edit,
                type: "post",
                data: {
                    'taskid': taskid,
                    'ids': ids,
                    'flowcode': flowcode,
                    'table': table,
                    'comment': comment,
                    'status':status,
                    // 'journal_level_id': select,
                },
                // beforeSend: function () {
                //     layer.load(2, {
                //         shade: [0.6, '#fff'], content: '数据提交中...', success: function (layero) {
                //             layero.find('.layui-layer-content').css({
                //                 'padding-top': '6px',
                //                 'width': '150px',
                //                 'padding-left': '40px'
                //             });
                //             layero.find('.layui-layer-ico16, .layui-layer-loading .layui-layer-loading2').css({
                //                 'width': '150px !important',
                //                 'background-position': '2px 0 !important'
                //             });
                //         }
                //     });
                // },
                success: function (res) {
                    if (res.code === 200) {
                        layer.msg(res.msg, {icon: 1});
                        var index = parent.layer.getFrameIndex(window.name); //获取当前窗口的name
                        parent.layer.closeAll();		//关闭窗口
                        window.parent.location.reload();
                    } else {
                        layer.msg(res.msg, {icon: 5});
                        return false;
                    }
                }
            });
        });
        $('#refuse').on('click', function (res) {
            var comment = $('#comment').val();
            $.ajax({
                url: refuse,
                type: "post",
                data: {
                    'taskid': taskid,
                    'ids': ids,
                    'flowcode': flowcode,
                    'table': table,
                    'comment': comment
                },
                beforeSend: function () {
                    layer.load(2, {
                        shade: [0.6, '#fff'], content: '数据提交中...', success: function (layero) {
                            layero.find('.layui-layer-content').css({
                                'padding-top': '6px',
                                'width': '150px',
                                'padding-left': '40px'
                            });
                            layero.find('.layui-layer-ico16, .layui-layer-loading .layui-layer-loading2').css({
                                'width': '150px !important',
                                'background-position': '2px 0 !important'
                            });
                        }
                    });
                },
                success: function (res) {
                    if (res.code === 200) {
                        layer.msg(res.msg, {icon: 1});
                        var index = parent.layer.getFrameIndex(window.name); //获取当前窗口的name
                        parent.layer.closeAll();		//关闭窗口
                        window.parent.location.reload();
                    } else {
                        layer.msg(res.msg, {icon: 5});
                        return false;
                    }
                }
            });
        });
        $('#flowchart').on('click', function (res) {
            layer.open({
                type: 2
                , title: "流程图"
                , content: url + '?' + param
                , area: ['70%', '70%']
                , maxmin: true
            });
        });
        $('#cancel').on('click', function (res) {
            console.log("取消");
        });
        $('#start').on('click', function (res) {
            var comment = $('#comment').val();
            var name =$('#name').val();
            var period = $('#period').val();
            var content = $('#content').val();
            $.ajax({
                url: edit,
                type: "post",
                data: {
                    'taskid': taskid,
                    'ids': ids,
                    'flowcode': flowcode,
                    'table': table,
                    'comment': comment,
                    'status':status,
                    'name':name,
                    'period':period,
                    'content':content,
                },
                // beforeSend: function () {
                //     layer.load(2, {
                //         shade: [0.6, '#fff'], content: '数据新增中...', success: function (layero) {
                //             layero.find('.layui-layer-content').css({
                //                 'padding-top': '6px',
                //                 'width': '150px',
                //                 'padding-left': '40px'
                //             });
                //             layero.find('.layui-layer-ico16, .layui-layer-loading .layui-layer-loading2').css({
                //                 'width': '150px !important',
                //                 'background-position': '2px 0 !important'
                //             });
                //         }
                //     });
                // },
                success: function (res) {
                    if (res.code === 200) {
                        layer.msg(res.msg, {icon: 1});
                        var index = parent.layer.getFrameIndex(window.name); //获取当前窗口的name
                        parent.layer.closeAll();		//关闭窗口
                        window.parent.location.reload();
                    } else {
                        layer.msg(res.msg, {icon: 5});
                        return false;
                    }
                }
            });
        });
        $('#check').on('click', function (res) {
            layer.open({
                type: 2
                , title: "查看{$schme['flowname']}({$instance['instancecode']})"
                , content: check + '?' + param
                , area: ['80%', '80%']
                , maxmin: true
                // , btn: ['确定', '流程图', '取消']
                // , success: function (res) {
                //     console.log(data.instancestatus);
                // }
            });
        })
    });
</script>
